<template>
  <div class="page-header">
    <ly-form
      :form="form"
      :page-name="pageName"
      @searchClick="searchClick"
      @resetClick="resetClick"
    >
      <!--      插槽回传-->
      <template
        v-for="item in form.items"
        :key="item.prop"
        v-slot:[item.slotName]="formItem"
      >
        <slot
          v-if="item.slotName"
          v-bind="formItem"
          :name="item.slotName"
        ></slot>
      </template>
    </ly-form>
  </div>
</template>

<script setup lang="ts">
import LyForm from '@/base-ui/lyform/ly-from.vue'
import type { ILyForm } from '@/global/types'

interface IProps {
  pageName: string
  form: ILyForm
}

defineProps<IProps>()

// 子传父：将搜索和重置事件传出去
const emits = defineEmits(['searchClick', 'resetClick'])
// 1.点击搜索按钮
const searchClick = (formData: any) => {
  emits('searchClick', formData)
}
// 2.点击重置按钮
const resetClick = () => {
  emits('resetClick')
}
</script>

<style scoped lang="less">
.page-header {
  padding: 20px 20px 10px;
}
</style>
